.navs {
  ul {
    padding: 0;
    list-style: none;
    display: flex;
  }

  li {
    margin-right: 1em;
  }
}

.outheader {
  height: 70px;
  background-color: rgba(0, 0, 0, 0);
  position: relative;
  z-index: 9;

  .con {
    width: 100%;
    height: 70px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 8%;
    box-sizing: border-box;

    .left {
      display: flex;
      height: 70px;
      align-items: center;

      .logo {
        width: 130px;
        height: 26px;
        margin-right: 50px;
      }

      .linkbox {
        display: flex;
        height: 70px;
        align-items: center;

        li {
          margin-right: 45px;
          font-size: 18px;
          color: #000;
          cursor: pointer;
          border-bottom: 2px solid rgba(0, 0, 0, 0);
        }

        li:hover {
          color: #666;
        }

        .active {
          border-bottom: 2px solid #000000;
        }

        .active:hover {
          color: #000;
        }
      }
    }

    .right {
      padding-right: 90px;
      display: flex;
      height: 70px;
      align-items: center;

      .ico {
        width: 30px;
        height: 30px;
        background: url('../assets/image/EN.png');
        margin-right: 20px;
        background-size: 30px;
        cursor: pointer;
      }

      .ico:hover {
        width: 30px;
        height: 30px;
        background: url('../assets/image/ENcolor.png');
        background-size: 30px;
      }

      .music_ico {
        width: 30px;
        height: 30px;
        background-image: url('../assets/image/f3.png');
        background-size: 30px;
        background-color: transparent;
        margin-right: 20px;
        cursor: pointer;
        border: none;

        .hide {
          position: absolute;
          top: 70px;
        }
      }

      .music_ico:hover {
        background-image: url('../assets/image/s2.png');
      }

      .colse {
        width: 30px;
        height: 30px;
        background-image: url('../assets/image/f4.png');
        background-size: 30px 30px;
        background-color: transparent;
        margin-right: 20px;
        cursor: pointer;
        border: none;
      }

      .colse:hover {
        background-image: url('../assets/image/s1.png');
      }

      .btn {
        width: 174px;
        height: 44px;
        line-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid #0F0F0F;
        border-radius: 22px;
        font-size: 16px;
        overflow: hidden;
        text-overflow: ellipsis;
        padding: 0 20px;
        box-sizing: border-box;
        white-space: nowrap;
        cursor: pointer;

        .fox {
          margin-right: 8px;
        }
      }
    }
  }
}

.otherheaderbg {
  background: #B79C6E;
}

.outcontent {
  // margin-top: -70px;
}

.outfooter {
  width: 100%;
  height: 170px;
  background: #000;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #fff;
  padding-left: 8%;
  padding-right: 90px;
  box-sizing: border-box;

  .left {
    display: flex;
    height: 170px;
    align-items: center;
  }

  .logo {
    width: 130px;
    height: 26px;
    background-image: url('../assets/image/logowhite.png');
    background-size: 130px 26px;
  }

  .linkbox {
    display: flex;
    max-width: 1000px;
    min-width: 600px;

    li {
      width: 25%;
      height: 170px;
      display: flex;
      align-items: center;

      img {
        width: 100%;
      }
    }
  }

  .right {
    height: 24px;
    display: flex;
    align-items: center;

    .ico {
      height: 30px;
      width: 30px;
      margin-left: 15px;
      background-image: url('../assets/image/enwhite.png');
      background-size: 30px;
    }
  }

}


@media screen and (max-width:750px) {
  .mobileHeader {
    font-size: 12px;

    .con {
      display: flex;
      justify-content: space-between;
      padding: 0 25px;
      background: #B79C6E;

      .left {
        display: flex;
        height: 60px;
        align-items: center;

        .logo {
          width: 70px;
        }
      }

      .right {
        display: flex;
        height: 60px;
        align-items: center;

        .ico {
          width: 24px;
          height: 24px;
          background: url('../assets/image/EN.png');
          margin-right: 10px;
          background-size: 24px;
          cursor: pointer;
        }

        .ico:hover {
          width: 24px;
          height: 24px;
          background: url('../assets/image/ENcolor.png');
          background-size: 24px;
        }

        .music_ico {
          width: 24px;
          height: 24px;
          background-image: url('../assets/image/f3.png');
          background-size: 24px;
          background-color: transparent;
          margin-right: 10px;
          cursor: pointer;
          border: none;
        }

        .music_ico:hover {
          background-image: url('../assets/image/s2.png');
        }

        .colse {
          width: 24px;
          height: 24px;
          background-image: url('../assets/image/f4.png');
          background-size: 24px 24px;
          background-color: transparent;
          margin-right: 10px;
          cursor: pointer;
          border: none;
        }

        .colse:hover {
          background-image: url('../assets/image/s1.png');
        }

        .btn {
          width: 130px;
          height: 40px;
          line-height: 40px;
          display: flex;
          align-items: center;
          justify-content: center;
          border: 1px solid #0F0F0F;
          border-radius: 22px;
          font-size: 12px;
          overflow: hidden;
          text-overflow: ellipsis;
          padding: 0 20px;
          box-sizing: border-box;
          white-space: nowrap;
          cursor: pointer;

          .fox {
            margin-right: 8px;
          }
        }
      }
    }
  }

  .outcontent {
    margin-top: 0px;
  }

  .mobilefooter {
    background: #000;
    padding-bottom: 70px;

    .imgbox {
      display: flex;
      align-content: flex-start;
      flex-flow: row wrap;

      li {
        display: flex;
        flex-direction: column;
        flex: 0 0 50%;
        align-items: center;

        img {
          width: 70%;
        }

        .last {
          position: relative;
          left: -6%;
        }
      }
    }

    .linkbox {
      background: #B79C6E;
      display: flex;
      height: 60px;
      align-items: center;
      justify-content: space-around;
      position: fixed;
      bottom: 0;
      width: 100%;
      z-index: 9;

      li {
        font-size: 16px;
        color: #666;
        width: 80px;
        height: 40px;
        padding-top: 10px;
        text-align: center;
        box-sizing: border-box;
      }

      .active {
        color: #000;
        background-image: url('../assets/mobileImg/yun.png');
        background-size: 60px 20px;
        background-repeat: no-repeat;
        background-position: 14px bottom;
      }
    }
  }
}